<!DOCTYPE html>
<html>

<head>
  <link href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" rel="stylesheet"/>
  <script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
  <link href="https://api.tiles.mapbox.com/mapbox-gl-js/v0.35.1/mapbox-gl.css" rel='stylesheet'/>
  <script src="https://api.tiles.mapbox.com/mapbox-gl-js/v0.35.1/mapbox-gl.js"></script>
  <script src="/static/js/leaflet-mapbox-gl.js"></script>
</head>

<body style='margin:0'>

<div id="map" style="width: 100vw; height: 100vh; background: white"></div>

<script>

var map = L.map('map').setView([38.912753, -77.032194], 15);

map.options.minZoom = 2;
var gl = L.mapboxGL({
  style: 'http://localhost:8900/static/style/osm_liberty/osm_liberty.json'
}).addTo(map);
map.fitWorld();

</script>
</body>

</html>
